const { GenerateSW } = require('workbox-webpack-plugin'); // PWA插件

// PWA服务
module.exports = new GenerateSW({
  swDest: 'sw.js',
  clientsClaim: true,
  skipWaiting: true, // 强制跳过生命周期
  // 自定义需要引入的一些js文件，供插件使用
  // importScripts: [
  //   'https://res01.aibao.com/js/workbox/workbox-v4.3.1/workbox-sw.js',
  // ],
  // include: [/\.html$/, /\.js$/, /\.css$/], // 只缓存js和html
  // 排除图片不缓存
  // exclude: [/\.(?:png|jpg|jpeg|svg)$/],
  exclude: [/\.sw.js$/],
  // maximumFileSizeToCacheInBytes: 4 * 1024 * 1024, // 缓存大小空间4mb
  // 通过传入urlPatterns、handlers和可用的一些options，在生成的service worker中去添加适当的代码来处理运行时的缓存。

  // 里面可以配置多个{}，写不同后缀文件缓存不同配置
  runtimeCaching: [
    {
      urlPattern: '/api/', // 可以使用正则new RegExp('^https://cors\.example\.com/')
      // urlPattern: /.*\.(js|css)/, // 匹配文件，也可以匹配网络地址

      /*
        handler应用网络优先策略。
        CacheFirst 缓存优先，请求后直接从 Cache 中取得结果，没有的话在发起网络请求，如果网络请求失败，并且没有缓存匹配，这将引发WorkboxError异常。
        CacheOnly 强制使用 Cache 资源，要是你想利用workbox其它插件，此缓存模式很合适，如果没有缓存匹配，这将引发WorkboxError异常。
        StaleWhileRevalidate 同时从缓存和网络请求资源。该策略将使用缓存的版本（如果可用）进行响应，否则等待网络响应。对于每个成功的请求，将使用网络响应更新缓存。

        NetworkFirst 请求后，首先尝试拿到网路请求的返回结果，请求到就直接返回并且更新 cache，否则返回缓存中的内容
        NetworkOnly 强制使用网络请求
      */
      handler: 'NetworkFirst',

      options: {
        networkTimeoutSeconds: 3, // 超过10s使用缓存做为回退方案。只能NetworkFirst模式
        cacheName: 'my-api-cache', // 为此路由指定自定义缓存名称。
        // 配置自定义缓存过期。
        // expiration: {
        //   maxEntries: 100, // 缓存条数限制（超过会删除最旧的一条）
        //   maxAgeSeconds: 24 * 60 * 60, // 缓存时间（秒） 24小时
        // },
        // 配置background sync.
        // backgroundSync: {
        //   name: 'my-queue-name',
        //   options: {
        //     maxRetentionTime: 60 * 60,
        //   },
        // },
        // 配置哪些response是可缓存的。
        cacheableResponse: {
          statuses: [0, 200],
          // headers: {'x-test': 'true'},
        },
        // 配置广播缓存更新插件。
        // broadcastUpdate: {
        //   channelName: 'my-update-channel',
        // },
        // // 添加您需要的任何其他逻辑插件。
        // plugins: [
        //   {cacheDidUpdate: () => /* 自定义插件代码 */}
        // ],
        // // matchOptions 和 fetchOptions 用于配置 handler.
        // fetchOptions: {
        //   mode: 'no-cors',
        // },
        // matchOptions: {
        //   ignoreSearch: true,
        // },
      },
    },
    {
      // 匹配跨域请求，使用以origin开头的正则:
      urlPattern: new RegExp('^http://localhost/#/'),
      handler: 'StaleWhileRevalidate',
      options: {
        cacheableResponse: {
          statuses: [0, 200],
        },
      },
    },
  ],

  // navigateFallback: '/app-shell', // 预先缓存单页应用
  // // 指定部份URL以外的才缓存，有白名单和黑名单配置
  // navigateFallbackBlacklist: [/^\/_/, /admin/], // 黑名单,以`/_`开头或包含`admin`的URL加入黑名单，优先级最高
  // navigateFallbackWhitelist: [/^\/pages/], // 白名单,以`/pages`开头的URL加入白名单, 优先级没上面的高
  // directoryIndex: 'index.html', // 当url路由没有匹配到时，自动添加后缀
  // navigationPreload: true, // 是否启用预加载，需要配合runtimeCaching使用
  // modifyURLPrefix: { '/dist': '' }, // 从网址中删除dist前缀
});
